<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page language="java" contentType="text/html; charset=utf-8"
	import="java.util.*" pageEncoding="utf-8"%>

<%
    String appName = request.getContextPath();
%>
<html>
<head>

<title>分拣机数据接口进程监控</title>
</head>
<link rel="stylesheet" type="text/css" href="<%=appName%>/js/themes/bootstrap/easyui.css">
<script type="text/javascript" src="<%=appName%>/js/jquery.min.js"></script>
<script type="text/javascript" src="<%=appName%>/js/jquery.easyui.min.js"></script>
<link rel="stylesheet" type="text/css" href="<%=appName%>/js/themes/icon.css">
<body>
	<div style="width: 600px; height: 400px; margin: 300px auto;">
	<div style="text-align: center; margin-left: -100px;margin-bottom:40px; width: 700px">
                        <span style="font-size:40px;font-weight:bold;color:#900b09;letter-spacing:10px;">分拣机数据接口进程监控</span>
                    </div>
		<div class="easyui-panel" style="width: 500px; margin: auto;">
		<div style="color:red; font-size:22px;">${message_login}</div>
			<div style="padding: 10px 60px 20px 110px">
				<form id="ff" method="post">
					
					<table cellpadding="5">
						<tr>
							<td>姓名：</td>
							<td><input class="easyui-textbox" type="text"
								name="username"
								data-options="required:true,prompt:'请输入用户名',iconCls:'icon-man',iconWidth:38"></input></td>
						</tr>
						<tr>
							<td>密码：</td>
							<td><input class="easyui-textbox" type="password"
								name="password"
								data-options="required:true,prompt:'请输入密码',iconCls:'icon-lock',iconWidth:38"></input></td>
						</tr>
						<tr>
							<td>验证：</td>
							<td><input class="easyui-textbox" type="text" name="verifyCode"
								data-options="required:true,prompt:'请输入验证码',iconCls:'icon-verify',iconWidth:38""></input></td>
								</tr><tr><td></td>
							<td style="text-align:right;"><img id="verifyCodeImage" onclick="reloadVerifyCode()"
								src="<%=appName%>/mvc/loginCtrl/getVerifyCodeImage" /></td>
						</tr>
					</table>
					<div style="text-align: center; padding-right:20px; margin-top:20px">
						<input type="submit" value="确认" />
					</div>
				</form>

			</div>
		</div>
	</div>
	<script>
	$(function(){
        $('#ff').form({
        	url:"<%=appName%>/mvc/loginCtrl/login",
            success:function(data){
            	var data = eval('(' + data + ')');  // change the JSON string to javascript object
                if(data.code == '-1'){
                	reloadVerifyCode();
                	$.messager.alert('Info', data.message, 'info');
                }else{
                	location.href="<%=appName%>/jsp/main.jsp";
                }
            }
        });
    });
	function reloadVerifyCode(){
		var verify=document.getElementById('verifyCodeImage');
		verify.setAttribute('src',"<%=appName%>/mvc/loginCtrl/getVerifyCodeImage?"+Math.random());
		//这里必须加入随机数不然地址相同我发重新加载
		}
	</script>

</body>
</html>